<template>
	<view class="content">
		<u-navbar title="我的收藏" :placeholder='true' height="88rpx" leftIconColor="#fff"
			titleStyle='color:#fff;font-size:32rpx' left-icon-size="32rpx" bg-color="#FF594D" :autoBack="true">
		</u-navbar>

		<view class="select_goods_list">
			<template v-for="item in collectionData">
				<view class="select_item" @click="navigateTo('/pages_goods/detail-page/detail-page?id='+item.commodityId)">
					<relevance-goods :item='item'></relevance-goods>
				</view>
			</template>
		</view>
	</view>
</template>

<script>
	import {
		getCollection
	} from '../../../api/mine.js'
	export default {
		data() {
			return {
				titleStyle: {
					color: '#fff',
				},
				actionStyle: {
					color: '#FF594D',
					'font-size': '26rpx',
				},
				keyword: "",
				collectionData: []
			}
		},
		created() {
			this.getCollectionData()
		},
		methods: {
			search(value) {
				// console.log(value);
			},
			async getCollectionData() {
				const res = await getCollection()
				this.collectionData = res.rows
				// console.log(res);
			},
			navigateTo(url) {
				uni.navigateTo({
					url
				})
			},
		}
	}
</script>

<style lang="scss">
	.content {
		background-color: #f3f3f3;
		min-height: 100vh;
		padding-bottom: 40rpx;
		box-sizing: border-box;
		padding-top: 30rpx;

		.select_search {
			padding: 20rpx;
		}

		.select_goods_list {
			.select_item {
				background-color: #fff;
				padding: 20rpx 30rpx;
				margin-bottom: 20rpx;
			}
		}
	}
</style>